<template>
    <List header="操作符：" border>
        <ListItem>
            <div class="operator-btns">
                <div>
                    <Button type="primary" shape="circle" @click="clickOperator('+')">+</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('-')">-</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('*')">*</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('/')">/</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('If')">If</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('(')">(</Button>
                    <Button type="primary" shape="circle" @click="clickOperator(')')">)</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('.')">.</Button>
                    <Button type="primary" shape="circle" @click="clickOperator(',')">,</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('>')">&gt;</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('<')">&lt;</Button>
                </div>
                <!--  -->
                <div>
                    <Button type="primary" shape="circle" @click="clickOperator('1')">1</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('2')">2</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('3')">3</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('4')">4</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('5')">5</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('6')">6</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('7')">7</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('8')">8</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('9')">9</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('0')">0</Button>
                </div>
                <div>
                    <!--  -->
                    <Button type="primary" shape="circle" @click="clickOperator('abs')">绝对值</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('int')">取整</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('mod')">取余</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('sqrt')">平方根</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('cbrt')">立方根</Button>
                </div>
                <div>
                    <Button type="primary" shape="circle" @click="clickOperator('X')">实际值</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('Y')">权重值</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('P')">满意值</Button>
                    <Button type="primary" shape="circle" @click="clickOperator('S')">不允许值</Button>
                </div>
                <div>
                    <!-- .计算结果 -->
                    <Button type="primary" shape="circle" @click="clickOperator('R')">指标计算结果</Button>
                </div>
            </div>
        </ListItem>
        <ListItem>
            <Input v-model="operator" type="textarea" placeholder readonly />
        </ListItem>
        <ListItem>
            <div class="text-center">
                <Button type="primary" @click="reset">重置</Button>
                <Button type="primary" @click="submit">保存</Button>
            </div>
        </ListItem>
    </List>
</template>

<script>
export default {
    // 计算器操作
    name: 'Operator',
    props: {
        operator: {
            type: String,
            required: true
        }
    },
    methods: {
        clickOperator(val) {
            this.$emit("clickOperator", val)
        },
        reset() {
            this.$emit("reset")
        },
        submit() {
            this.$emit("submit")
        },
    }
}
</script>

<style>
</style>
